import React from "react";
import {
  Bar,
  BarChart,
  CartesianGrid,
  ResponsiveContainer,
  Tooltip,
  XAxis,
  YAxis,
} from "recharts";
import { QuestionCheckboxStatPropsType } from "./interface";

const StatComponent: React.FC<QuestionCheckboxStatPropsType> = ({
  stat = [],
}) => {
  return (
    <ResponsiveContainer width="100%" height="100%">
      <BarChart
        width={364}
        height={364}
        data={stat}
        margin={{
          top: 5,
          right: 30,
          bottom: 5,
          left: 0,
        }}
      >
        <CartesianGrid strokeDasharray="3 3" />
        <XAxis dataKey="name" />
        <YAxis />
        <Bar dataKey="count" fill="#8884d8" />
        <Tooltip />
      </BarChart>
    </ResponsiveContainer>
  );
};

export default StatComponent;
